<template>
  <div class="page-bg">
    <el-divider></el-divider>
    <div class="weui-cell">
      <div class="weui-cell__hd">
        <label class="weui-label">课题名称</label>
      </div>
      <div class="weui-cell__bd cellMargin">
        <div class="weui_cell_bd weui_cell_primary">
          {{name}}
        </div>
      </div>
    </div>
    <div class="weui-cell">
      <div class="weui-cell__hd">
        <label class="weui-label">开始时间</label>
      </div>
      <div class="weui-cell__bd">
        <div class="weui_cell_bd weui_cell_primary">
          <input class="weui_input" type="date" v-model="startTime">
        </div>
      </div>
    </div>
    <div class="weui-cell">
      <div class="weui-cell__hd">
        <label class="weui-label">结束时间</label>
      </div>
      <div class="weui-cell__bd">
        <div class="weui_cell_bd weui_cell_primary">
          <input class="weui_input" type="date" v-model="endTime">
        </div>
      </div>
    </div>
    <div class="weui-cell">
      <div class="weui-cell__hd">
        <label class="weui-label">课题负责人</label>
      </div>
      <div class="weui-cell__bd cellMargin">
        <div class="weui_cell_bd weui_cell_primary">
          {{leaderName}}
        </div>
      </div>
    </div>
    <div class="weui-cell weui-cells_form">
      <div class="weui-cell__hd">
        <label class="weui-label">主要内容</label>
      </div>
      <el-input
        type="textarea"
        :rows="7"
        placeholder="请输入课题主要内容"
        v-model="content"
        clearable>
      </el-input>
    </div>
    <div class="weui-cell weui-cells_form">
      <div class="weui-cell__hd">
        <label class="weui-label">考核指标</label>
      </div>
      <el-input
        type="textarea"
        :rows="7"
        placeholder="请输入课题考核指标"
        v-model="target"
        clearable>
      </el-input>
    </div>
    <el-divider></el-divider>
        <div class="weui-btn-area">
          <a href="javascript:;" class="weui-btn weui-btn_primary" @click="okTask=true">提交修改</a>
        </div>
    <el-dialog
      title="提示"
      :visible.sync="okTask"
      width="70%">
      <span>确定提交《{{name}}》的安排吗？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="okTask = false">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  name: 'checkProjectTaskForm',
  data () {
    return {
      projectID: '',
      task: '',
      okTask: false,
      name: '',
      startTime: '',
      endTime: '',
      content: '',
      target: '',
      leaderName: ''
    }
  },
  methods: {
    getTask () {
      axios.get(this.url + '/module/id/' + sessionStorage.getItem('taskID'))
        .then(this.getTaskSucc)
    },
    getTaskSucc (res) {
      if (res.status === 200) {
        res = res.data
        this.task = res
        this.name = res.name
        this.startTime = res.startTime
        this.endTime = res.endTime
        this.content = res.content
        this.target = res.target
        this.leaderName = res.leaderName
        this.projectID = res.projectID
      }
    },
    submit () {
      this.$axios({
        method: 'put',
        url: this.url + '/module/',
        data: {
          id: parseInt(sessionStorage.getItem('taskID')),
          leaderID: this.task.leaderID,
          name: this.name,
          startTime: this.startTime,
          endTime: this.endTime,
          content: this.content,
          target: this.target
        }
      }).then((res) => {
        if (res.status === 200) alert('提交成功！')
        else alert('提交失败！请重新打开页面')
        this.okTask = false
        this.$router.push('/checkProjectDetail')
      }).catch((err) => {
        alert(err)
      })
    }
  },
  mounted () {
    this.getTask()
  }
}
</script>

<style lang="stylus" scoped>
  .taskName
    margin-left .2rem
  .row
    margin-top .6rem
    margin-bottom .6rem
  .taskIcon
    margin-right .3rem
    color #16b0ff
  .delIcon
    float right
    margin-right .5rem
  .projectIcon
    margin-right .2rem
  .addTaskIcon
    float: right
    font-size 19.9px
    margin-right .9rem
    margin-top .18rem
    color black
</style>
